<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title></title>
    <link rel="stylesheet" href="css/index.css">
    <script src="js/echarts.min.js"></script>

    
</head>

<body>
    <div class="container">
        <!--aside-->
        <aside>
            <div class="aside-top">
                <h4>当前对比数据</h4>
                <h1>3,456,789</h1>
            </div>
            <div class="analyze">
                <h2>违法犯罪人员分析</h2>
                <div class="left-box" id="pie-charts">
                    <!--饼状图-->
                </div>
            </div>
            <div class="analyze population">
                <h2>人口出入记录</h2>
                <div class="table">
                    <table cellpadding="0" cellspacing="0">
                        <tr>
                            <th>姓名</th>
                            <th>角色</th>
                            <th>开门方式</th>
                            <th>时间</th>
                        </tr>
                        <tr>
                            <td>张梦</td>
                            <td>访客</td>
                            <td>人脸</td>
                            <td>2018-11-01 13:51:23
                            </td>
                        </tr>
                        <tr>
                            <td>李阳荣</td>
                            <td>业主</td>
                            <td>APP</td>
                            <td>2018-11-01 13:51:23
                            </td>
                        </tr>
                        <tr>
                            <td>张无双</td>
                            <td>访客</td>
                            <td>人脸</td>
                            <td>2018-11-01 13:51:23
                            </td>
                        </tr>
                        <tr>
                            <td>李阳</td>
                            <td>业主</td>
                            <td>APP</td>
                            <td>2018-11-01 13:51:23
                            </td>
                        </tr>
                    </table>
                </div>
            </div>
        </aside>
        <!--center-->
        <section>
            <div class="sec-top">
                <img src="img/jinghui.png" alt="">
                <p>智慧社区内网比对平台</p>
            </div>
            <div class="sec-bar">
                <div class="timeBox">
                    <div class="dateBox">
                        <p class="time">16:19:59</p>
                    </div>
                    <div class="weather">
                        <img src="img/weather_img01.png" alt="">
                        <div class="weatherInfo">

                        </div>
                    </div>
                </div>
                <div class="aside">
                    <img src="img/line_bg.png" alt="">
                    <div class="asideInfo">
                        <p class="beijing">NO.1北京：2543289人</p>
                        <p class="tianjing">NO.1天津：5690人</p>
                        <p class="heBei">NO.1河北：456人</p>
                    </div>
                </div>
            </div>
            <div class="sec-bot">
                <div class="map" id="mapBox">
                    <!--地图-->
                </div>
            </div>
        </section>
        <!--right-->
        <div class="right">
            <div class="analyze age">
                <h2>违法犯罪人员年龄分析</h2>
                <p class="danwei">单位：岁</p>
                <div class="left-box" id="pie-charts2">
                    <!--饼状图-->
                </div>
            </div>
            <div class="analyze area">
                <h2>违法犯罪人员地区分布</h2>
                <div class="zoon" id="zoon">
                    <!--地区图-->
                </div>
            </div>
            <div class="analyze time">
                <h2>人口出入时间段统计</h2>
                <div class="timeSpan" id="timeSpan">
                    <!--折线图-->
                </div>
            </div>
        </div>
    </div>
</body>

</html>
<!-- 引入echarts -->
<!-- map地图脚本 -->
<script src="js/china.js"></script>
<!-- 地图 -->
<script src="https://www.makeapie.com/dep/echarts/map/js/china.js"></script>
<script src="js/ditu.js"></script>
<!-- 违法犯罪人员分析 -->
<script src="js/wf.js"></script>
<!-- 违法犯罪人员年龄分析 -->
<script src="js/age.js"></script>
<!-- 违法犯罪人员地区分布
 -->
<script src="js/fzry.js"></script>
<!-- 人口出入时间段统计 -->
<script src="js/time.js"></script>